<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>18、表单属性指令-v-model-多行入框.html</title>
</head>
<body>

<div id="app">
    <p><label for="username">用户名：</label><input type="text" id="username"></p>
    <p><label>用户名：<input type="text" id="username2"></label></p>

    <hr>
    <p><label><input type="checkbox" name="hobbys" value="1">篮球</label></p>
    <p><label><input type="checkbox" name="hobbys" value="2">足球</label></p>
    <p><label><input type="checkbox" name="hobbys" value="3">羽毛球</label></p>

    <p><input type="checkbox" name="hobbys" id="hobbys1" value="1"><label for="hobbys1">篮球</label></p>
    <p><input type="checkbox" name="hobbys" id="hobbys2" value="2"><label for="hobbys2">足球</label></p>
    <p><input type="checkbox" name="hobbys" id="hobbys3" value="3"><label for="hobbys3">羽毛球</label></p>


    <hr>
    <p><label><input type="radio" name="gender" value="0">女</label></p>
    <p><label><input type="radio" name="gender" value="1">男</label></p>
    <p><label><input type="radio" name="gender" value="2">保密</label></p>
    <hr>
    <p><input type="radio" name="gender" id="gender0" value="0"><label  for="gender0">女</label></p>
    <p><input type="radio" name="gender" id="gender1" value="1"><label  for="gender1">男</label></p>
    <p><input type="radio" name="gender" id="gender2" value="2"><label  for="gender2">保密</label></p>



</div>

</body>
</html>